<template>
    <div>
        <!-- 面包屑 -->
        <el-bread />
        <!-- 添加按钮 -->
        <el-button type="primary" class="addButton" @click="addDialog">添加</el-button>
        <!-- 表格 -->
        <v-list @edit="edit"/>
        <!-- 弹框 -->
        <v-dialog ref="roleRef" :isShow="isShow" :isAdd="isAdd" @cancel="cancel"/>
    </div>
</template>

<script lang="ts" setup>
import vList from './list.vue'
import vDialog from './dialog.vue'
import {ref} from 'vue'
let roleRef = ref<any>(null)
// 弹框的显示隐藏
let isShow = ref(false)
// 判断是添加还是编辑
let isAdd = ref(true)
let addDialog = () => {
  isShow.value = true;
  isAdd.value = true
}
let cancel = ()=>{
  isShow.value = false
}
// 编辑
let edit = (id:number) => {
  isShow.value = true;
  isAdd.value = false;
  roleRef.value.lookup(id)
}
</script>

<style lang="less" scoped>
.addButton {
  margin-top: 10px;
}
</style>